import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store'
// 引入路由隐射的组件
// import Login from '@/views/login/index'
// import Home from '@/views/home/index'
// import Advert from '@/views/advert/index'
// import AdvertSpace from '@/views/advert-space/index'
// import Layout from '@/views/layout/index'
// 路由优化
// 1.使用路由懒加载，将路由分包打包，减少体积，并且提高路由加载效率
// 2.使用webpack的魔法注释，给每个包命名
Vue.use(VueRouter)

const routes = [
  {
    path: '/login',
    name: 'login',
    // component: Login
    component: () => import(/* webpackChunName: 'login' */'@/views/login/index')
  },
  {
    path: '/',
    component: () => import(/* webpackChunName: 'layout' */'@/views/layout/index'),
    // 添加需要认证的 requiresAuth 信息
    meta: { requiresAuth: true },
    children: [
      {
        path: '',
        name: 'home',
        redirect: '/course',
        component: () => import(/* webpackChunName: 'home' */'@/views/home/index')
      },
      {
        path: '/advert',
        name: 'advert',
        component: () => import(/* webpackChunName: 'advert' */'@/views/advert/index')
      },
      {
        path: '/advert-space',
        name: 'advertSpace',
        component: () => import(/* webpackChunName: 'advert-space' */'@/views/advert-space/index')
      },
      {
        path: '/course',
        name: 'course',
        component: () => import(/* webpackChunName: 'course' */'@/views/course/index')
      },
      {
        path: '/menu',
        name: 'menu',
        component: () => import(/* webpackChunName: 'menu' */'@/views/menu/index')
      },
      // 资源列表
      {
        path: '/resource',
        name: 'resource',
        component: () => import(/* webpackChunName: 'resource' */'@/views/resource/index')
      },
      // 资源分类
      {
        path: '/resourceCategory',
        name: 'resourceCategory',
        component: () => import(/* webpackChunName: 'resource' */'@/views/resource/resourceCategory')
      },
      // 角色列表
      {
        path: '/role',
        name: 'role',
        component: () => import(/* webpackChunName: 'role' */'@/views/role/index')
      },
      // 给角色分配菜单
      {
        path: '/role/:roleId/alloc-menu',
        name: 'alloc-menu',
        component: () => import(/* webpackChunName: 'alloc-menu' */'@/views/role/allocMenu'),
        props: true
      },
      // 角色管理
      {
        path: '/role/:roleId/alloc-resource',
        name: 'alloc-resource',
        component: () => import(/* webpackChunName: 'alloc-resource' */'@/views/role/allocResource'),
        props: true
      },
      {
        path: '/user',
        name: 'user',
        component: () => import(/* webpackChunName: 'user' */'@/views/user/index')
      },
      {
        path: '/menu/create-menu',
        name: 'create-menu',
        component: () => import(/* webpackChunName: 'createMenu' */'@/views/menu/create')
      },
      {
        path: '/menu/:id/edit-menu',
        name: 'edit-menu',
        component: () => import(/* webpackChunName: 'editMenu' */'@/views/menu/edit')
      },
      // 新增课程
      {
        path: '/course/create-course',
        name: 'createCourse',
        component: () => import(/* webpackChunName: 'create-course' */'@/views/course/create')
      },
      // 编辑课程
      {
        path: '/course/:courseId  /edit-course',
        name: 'editCourse',
        component: () => import(/* webpackChunName: 'edit-course' */'@/views/course/edit'),
        props: true
      },
      // 课程内容
      {
        path: '/course/:courseId/course-section',
        name: 'courseSection',
        component: () => import(/* webpackChunName: 'course-section' */'@/views/course/courseSection'),
        props: true
      },
      // 上传视频页面
      {
        path: '/course/:courseId/course-video',
        name: 'courseVideo',
        component: () => import(/* webpackChunName: 'course-video' */'@/views/course/course-video'),
        props: true
      }
    ]
  },
  {
    path: '*',
    name: 'errorPage',
    component: () => import(/* webpackChunName: 'course' */'@/views/error-page/index')
  }
]

const router = new VueRouter({
  routes
})

router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // 验证 to 路由是否需要身份认证
    if (!store.state.user) {
      // 未登录，跳转到登录页
      return next({
        name: 'login',
        // 将本次跳转的路由信息 fullPath 传递给 login 页面
        query: {
          redirect: to.fullPath
        }
      })
    }
    // 已经登录，允许通过
    next()
  } else {
    next() // 确保一定要调用 next()
  }
})

export default router
